[AngularJS] select 태그에 ng-model 적용시 option 요소가 생기는 문제

AngularJS의 select태그에 ngModel을 사용하는 경우 아래와 같은 문제가 발생하였습니다. 의도하지 않은 option 요소가 나타납니다.

이런 이슈가 나타나는 이슈는 ng-model이 적용된 select 태그가 undefined 상태의 option값을 만들기 때문입니다. 이를 해결하기 위한 방법이 딱히 없는데 그 중에서 가장 간단하고 효과적인 방법이 css를 사용하는 방법입니다.

# select 태그의 option 엘리먼트 해결방법

이를 사용하기 위해서 CSS를 아래와 같이 사용합니다. 즉 선택된 option에 display:none을 추가합니다.


위 html 코드에 아래의 css를 추가합니다.

이 방법으로 해결이 가능합니다.